Adwaita: fix button border logic
authorJakub Steiner <jimmac@gmail.com>
Mon, 11 Jan 2021 13:08:57 +0000 (14:08 +0100)
committerJakub Steiner <jimmac@gmail.com>
Mon, 11 Jan 2021 13:08:57 +0000 (14:08 +0100)
- tint borders dark on non default / blue / red buttons
- just use plain $borders_color otherwise
- fixes HC/HCi
- ditch -alt buttons

gtk/theme/Adwaita/_common.scss
gtk/theme/Adwaita/_drawing.scss

index 0562745e32b9c879e828da63ff606031de14fbe2..d0bda3fe513d77a6e45f4429db7d82f6980072e5 100644 (file)
@@ -2366,6 +2366,8 @@ switch {
   }
 
   > slider {
+    @include button(normal);
+
     margin: -1px;
     min-width: 24px;
     min-height: 24px;
@@ -2373,8 +2375,6 @@ switch {
     border-color: $borders_color;
     border-radius: 50%;
     transition: $button_transition;
-
-    @include button(normal);
   }
   
   > image { color: transparent; } /* only show i / o for the accessible theme */
@@ -2674,7 +2674,7 @@ scale {
   }
 
   > trough > slider {
-    @include button(normal-alt);
+    @include button(normal);
 
     border: 1px solid darken($alt_borders_color, 3%);
     border-radius: 100%;
index 76a34d278f5f4e44eca09e6ffdff0a11dc7bae54..d8c775848af653d6f54ddeef1643285f06ae697a 100644 (file)
   @else { @return darken($c, 15%); }
 }
 
-
-@mixin button($t, $c:lighten($bg_color,2%), $tc:$fg_color) {
+$_default_button_c: lighten($bg_color,2%);
+@mixin button($t, $c:$_default_button_c, $tc:$fg_color) {
 //
 // Button drawing function
 //
   // normal button
   //
     color: $tc;
-    outline-color: if($c != $bg_color, $alt_focus_border_color, $focus_border_color);
-    border-color: _border_color($c);
-    border-bottom-color: if($c != $bg_color, _border_color($c, true), $alt_borders_color);
+    outline-color: if($c != $_default_button_c, $alt_focus_border_color, $focus_border_color);
+    border-color: if($c!=$_default_button_c, _border_color($c, true), $borders_color); //tint if not default button color
     background-image: if($variant == 'light', linear-gradient(to top, darken($c, 2%) 2px, $c),
                                               linear-gradient(to top, darken($c,1%) 2px, $c));
     @include _shadows($_button_shadow);
   // hovered button
   //
     color: $tc;
-    border-color: if($c != $bg_color, _border_color($c), $borders_color);
-    border-bottom-color: if($c != $bg_color, _border_color($c, true), $alt_borders_color);
+    border-color: if($c != $_default_button_c, _border_color($c), $borders_color);
     @if $variant == 'light' {
       background-image: linear-gradient(to top, darken($c,16%), darken($c,8%) 1px);
       @include _shadows($_button_shadow);
     }
   }
 
-  @if $t==normal-alt {
-  //
-  // normal button alternative look
-  //
-    color: $tc;
-    outline-color: if($c != $bg_color, $alt_focus_border_color, $focus_border_color);
-    border-color: if($c != $bg_color, _border_color($c, true), $alt_borders_color); //colored buttons
-    @if $variant == 'light' {
-      background-image: linear-gradient(to bottom, lighten($c, 5%) 20%, $c 90%);
-      @include _shadows($_button_shadow);
-    }
-    @else {
-      background-image: linear-gradient(to bottom, darken($c, 3%) 20%, darken($c, 6%) 90%);
-      @include _shadows($_button_shadow);
-    }
-  }
-
   @else if $t==active {
   //
   // pushed button
   //
     color: $tc;
-    border-color: if($c != $bg_color, _border_color($c), $borders_color);
+    border-color: if($c != $_default_button_c, _border_color($c), $borders_color);
     background-image: if($variant == 'light', image(darken($c, 14%)), image(darken($c, 9%)));
     box-shadow: none;
   }
   // pushed togglebutton hover
   //
     color: $tc;
-    border-color: if($c != $bg_color, _border_color($c), $borders_color);
+    border-color: if($c != $_default_button_c, _border_color($c), $borders_color);
     background-image: if($variant == 'light', image(darken($c, 18%)), image(darken($c, 12%)));
     box-shadow: none;
   }
   // pushed togglebutton pushed further :)
   //
     color: $tc;
-    border-color: if($c != $bg_color, _border_color($c), $borders_color);
+    border-color: if($c != $_default_button_c, _border_color($c), $borders_color);
     background-image: if($variant == 'light', image(darken($c, 22%)), image(darken($c, 14%)));
     box-shadow: none;
   }
   //
   // insensitive button
   //
-    $_bg: if($c != $bg_color, mix($c, $base_color, 85%), $insensitive_bg_color);
+    $_bg: if($c != $_default_button_c, mix($c, $base_color, 85%), $insensitive_bg_color);
 
     color: if($tc != $fg_color, mix($tc, $_bg, 50%), $insensitive_fg_color);
-    border-color: if($c != $bg_color, _border_color($c), $insensitive_borders_color);
+    border-color: if($c != $_default_button_c, _border_color($c), $insensitive_borders_color);
     background-image: image($_bg);
   }
 
   // insensitive pushed button
   //
     $_bg: if($variant == 'light', darken(mix($c, $base_color, 85%), 8%), darken(mix($c, $base_color, 85%), 6%));
-    $_bc: if($c != $bg_color, _border_color($c), $insensitive_borders_color);
+    $_bc: if($c != $_default_button_c, _border_color($c), $insensitive_borders_color);
 
-    color: if($c != $bg_color, mix($tc, $_bg, 60%), $insensitive_fg_color);
+    color: if($c != $_default_button_c, mix($tc, $_bg, 60%), $insensitive_fg_color);
     border-color: $_bc;
     background-image: image($_bg);
     box-shadow: none;
   //
   // backdrop button
   //
-    $_bg: if($c != $bg_color, $c, $backdrop_bg_color);
+    $_bg: if($c != $_default_button_c, $c, $backdrop_bg_color);
     $_bc: if($variant == 'light', $c, _border_color($c));
 
     color: if($tc != $fg_color, mix($tc, $_bg, 80%), $backdrop_fg_color);
-    border-color: if($c != $bg_color, $_bc, $backdrop_borders_color);
+    border-color: if($c != $_default_button_c, $_bc, $backdrop_borders_color);
     background-image: image($_bg);
     box-shadow: none;
   }
     $_bc: if($variant == 'light', $_bg ,_border_color($c));
 
     color: if($tc != $fg_color, mix($tc, $_bg, 80%), $backdrop_fg_color);
-    border-color: if($c != $bg_color, $_bc, $backdrop_borders_color);
+    border-color: if($c != $_default_button_c, $_bc, $backdrop_borders_color);
     background-image: image($_bg);
     box-shadow: none;
   }
   // backdrop insensitive button
   //
 
-    $_bg: if($c != $bg_color, mix($c, $base_color, 85%), $insensitive_bg_color);
+    $_bg: if($c != $_default_button_c, mix($c, $base_color, 85%), $insensitive_bg_color);
     $_bc: if($variant == 'light', $_bg,_border_color($c));
 
-    color: if($c != $bg_color, mix($tc, $_bg, 35%), $backdrop_insensitive_color);
-    border-color: if($c != $bg_color, $_bc, $backdrop_borders_color);
+    color: if($c != $_default_button_c, mix($tc, $_bg, 35%), $backdrop_insensitive_color);
+    border-color: if($c != $_default_button_c, $_bc, $backdrop_borders_color);
     background-image: image($_bg);
     box-shadow: none;
   }
     $_bg: if($variant == 'light', darken(mix($c, $base_color, 85%), 8%), darken(mix($c, $base_color, 85%), 4%));
     $_bc: if($variant == 'light', $_bg, _border_color($c));
 
-    color: if($c != $bg_color, mix($tc, $_bg, 35%), $backdrop_insensitive_color);
-    border-color: if($c != $bg_color, $_bc, $backdrop_borders_color);
+    color: if($c != $_default_button_c, mix($tc, $_bg, 35%), $backdrop_insensitive_color);
+    border-color: if($c != $_default_button_c, $_bc, $backdrop_borders_color);
     background-image: image($_bg);
     box-shadow: none;
   }
   //
   // normal osd button
   //
-    $_bg: if($c != $bg_color, transparentize($c, 0.5), $osd_bg_color);
+    $_bg: if($c != $_default_button_c, transparentize($c, 0.5), $osd_bg_color);
 
     color: $osd_fg_color;
-    outline-color: if($c != $bg_color, $alt_focus_border_color, $focus_border_color);
+    outline-color: if($c != $_default_button_c, $alt_focus_border_color, $focus_border_color);
     border-color: $osd_borders_color;
     background-color: transparent;
     background-image: image($_bg);
   //
   // active osd button
   //
-    $_bg: if($c != $bg_color, transparentize($c, 0.3), darken($osd_bg_color, 10%));
+    $_bg: if($c != $_default_button_c, transparentize($c, 0.3), darken($osd_bg_color, 10%));
 
     color: white;
     border-color: $osd_borders_color;
   //
   // active osd button
   //
-    $_bg: if($c != $bg_color, $c, darken($osd_bg_color, 20%));
+    $_bg: if($c != $_default_button_c, $c, darken($osd_bg_color, 20%));
 
     color: white;
     border-color: $osd_borders_color;
   //
   // backdrop osd button
   //
-    $_bg: if($c != $bg_color, transparentize($c, 0.5), $osd_bg_color);
+    $_bg: if($c != $_default_button_c, transparentize($c, 0.5), $osd_bg_color);
 
     color: $osd_fg_color;
     border-color: $osd_borders_color;